<!DOCtype html>
<html ng-app="advertiserApp">
<head>
<meta charset="utf-8" />
<title>已投放广告</title>
<script type="text/javascript"
	src="/web-adv/advWeb/static/vendor/angular/angular.min.js"></script>
<script type="text/javascript"
	src="/web-adv/advWeb/static/vendor/jquery/dist/jquery.min.js"></script>
<script type="text/javascript"
	src="/web-adv/advWeb/static/vendor/bootstrap/dist/js/bootstrap.min.js"></script>
<script type="text/javascript"
	src="/web-adv/advWeb/static/js/mainApp.js"></script>
<script type="text/javascript"
	src="/web-adv/advWeb/controller/advertiserCtrl.js"></script>
<script type="text/javascript"
	src="/web-adv/advWeb/static/js/main.js"></script>
<script type="text/javascript"
	src="/web-adv/advWeb/static/vendor/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
<script type="text/javascript"
	src="/web-adv/advWeb/static/vendor/bootstrap-datetimepicker/locales/bootstrap-datetimepicker.zh-CN.js"></script>
<link rel="stylesheet"
	href="/web-adv/advWeb/static/vendor/bootstrap/dist/css/bootstrap.min.css" />
<link rel="stylesheet"
	href="/web-adv/advWeb/static/vendor/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css" />
<link rel="stylesheet"
	href="/web-adv/advWeb/static/styles/layout.css" />
<link rel="stylesheet"
	href="/web-adv/advWeb/static/styles/main.css" />
<link rel="shortcut icon"
	href="/web-adv/advWeb/static/favicon.ico" />
<link rel="bookmark"
	href="/web-adv/advWeb/static/favicon.ico" />
<style type="text/css">
.selectAdModalOption {
	outline: none;
	border: 1px solid #eee;
	width: 60%;
	margin: 20px auto;
	overflow: auto
}

.selectAdModalOption option {
	padding: 10px 0 10px 10px
}
</style>
</head>
<body ng-controller="advertiserCtrl" onload="editPictureAd()">
	<div class="headerBox"></div>
	<div class="nav">
		<ul></ul>
	</div>
	<div class="content">
		<!-- begin -->
		<div class="websiteMapBox">
			<span>当前页面></span> <span>已投放广告</span>
		</div>
		<div class="itemAdGroup">
			<div class="topTitle">
				<button class="btn btn-primary btnTitle">投放时间</button>
				<button class="modifyBtn btn btn-primary" data-toggle="modal"
					data-target=".dateModal">修改</button>
			</div>
			<div class="adDescribe" style="margin-left: 150px;">
				<span>投放时间:</span> <span id="adDescribeTimeBegin"></span>至<span
					id="adDescribeTimeEnd"></span>
			</div>
		</div>
		<div class="itemAdGroup">
			<div class="topTitle">
				<button class="btn btn-primary btnTitle">广告名称</button>
			</div>
			<div class="adDescribe " style="margin-left: 150px;">
				<span>广告名称:</span> <input id="adId" hidden /> <span id="adName"></span> <img id="adImage"
					src="">
			</div>
		</div>
		<div class="itemAdGroup">
			<div class="topTitle">
				<button class="btn btn-primary btnTitle">投放金额</button>
				<!-- <button class="modifyBtn btn btn-primary">修改</button> -->
			</div>
			<div class="adDescribe " style="margin-left: 150px;">
				<span>投放金额:</span>
				<div
					style="background: #ccc;width: 600px;height: 60px;border-radius: 5px;display: inline-block;line-height: 60px;">
					<div>
						<span id="setBalance"></span>(元)
					</div>
				</div>
				<br> <br> <br> <span>投放余额:</span>
				<div
					style="background: #ccc;width: 600px;height: 60px;border-radius: 5px;display: inline-block;line-height: 60px;">
					<div>
						<span id="setTotal"></span>(元)
						<input id="deliveryRemainingAmount" hidden="ture">
					</div>
					<button class="modifyBtn btn btn-primary"
						style="right: 450px;top: 190px;" data-toggle="modal"
						data-target=".setTotalModal"
						onclick="modalDialog.setTotalValue($(this))">修改</button>
				</div>
				<br> <br> <br> <span>投放单价:</span>
				<div
					style="background: #ccc;width: 600px;height: 60px;border-radius: 5px;display: inline-block;line-height: 60px;">
					<div>
						<span id="setPrice"></span>(次/元)
					</div>
					<button class="modifyBtn btn btn-primary"
						style="right: 450px;top: 300px;" data-toggle="modal"
						data-target=".setPriceModal"
						onclick="modalDialog.setPriceValue($(this))">修改</button>
				</div>
			</div>
		</div>
		<div class="itemAdGroup">
			<div class="topTitle">
				<button class="btn btn-primary btnTitle">广告终端格式</button>
			</div>
			<div class="adClient right">
				<div class="left">
					<img id="typeImg"
						src=""
						alt=""> <span id="typeImage"></span>
				</div>
				<div class="center">
					<img id="adLogo"
						src=""
						alt="">
				</div>
				<div class="clear"></div>
			</div>
			<div class="clear"></div>
		</div>
		<div class="itemAdGroup">
			<div class="topTitle">
				<button class="btn btn-primary btnTitle">投放渠道</button>
			</div>
			<div class="adDitch right">
				<div class="adDitchAll left">
					<div>
						<input type="checkbox" checked="checked" id="putCheckBox"/> <label>默认</label> <label>投放全渠道</label>
					</div>
					<button class="btn btn-primary" id="getPlacements"
						data-toggle="modal" data-target=".selectAdDitchModal"
						onclick="modalDialog.selectAdDitchShow($(this))">添加</button>
				</div>
				<ul class="right listGroup" id="placement">

				</ul>
				<div class="clear"></div>
			</div>
			<div class="clear"></div>
		</div>
		 <div class="itemAdGroup">
			<div class="topTitle">
				<button class="btn btn-primary btnTitle">广告属性标签</button>
			</div>
			<div class="adTarget">
				<ul id="adClassify">
				</ul>
			</div>
			<div class="clear"></div>
		</div>
		<!--<div class="itemAdGroup">
			<div class="topTitle">
				<button class="btn btn-primary btnTitle">兴趣爱好</button>
			</div>
			<div class="adTarget">
				<ul>
					<li><img
						src="/web-adv/advWeb/static/images/adTarget1.png"
						alt=""></li>
					<li><img
						src="/web-adv/advWeb/static/images/adTarget2.png"
						alt=""></li>
					<li><img
						src="/web-adv/advWeb/static/images/adTarget3.png"
						alt=""></li>
					<li><img
						src="/web-adv/advWeb/static/images/adTarget4.png"
						alt=""></li>
					<li><img
						src="/web-adv/advWeb/static/images/adTarget5.png"
						alt=""></li>
					<li><img
						src="/web-adv/advWeb/static/images/adTarget6.png"
						alt=""></li>
					<li><img
						src="/web-adv/advWeb/static/images/adTarget6.png"
						alt=""></li>
					<li><img
						src="/web-adv/advWeb/static/images/adTarget6.png"
						alt=""></li>
				</ul>
			</div>
			<div class="clear"></div>
		</div> -->
		<button id="editAd" class="btn btn-primary modifyImgSignBtn">投放</button>
		<!-- end -->
	</div>
	<!-- 日期 -->
	<div class="modal fade dateModal" tabindex="-1" role="dialog"
		aria-labelledby="myLargeModalLabel" aria-hidden="true">
		<div class="modal-dialog modal-lg">
			<div class="modal-content">
				<div class="modal-body" style="text-align:center;margin-top:40px">
					<div class="form-group form-inline" style="margin-bottom:40px">
						<input type="text" value="" data-date-include="first"
							class="form-control"  id="putStartTime"/> 至 <input type="text" value="" id="putEndTime"
							data-date-include="last" class="form-control" />
					</div>
					<div class="form-group form-inline">
						<button class="btn btn-primary"
							onclick="modalDialog.dateModal($(this))">确定</button>
						<button class="btn btn-primary" style="margin-left:82px;"
							data-dismiss="modal">取消</button>
					</div>
					<script type="text/javascript">
					function show(){
						   var mydate = new Date();
						   var mounth;
						   var day;
						   if(mydate.getMonth()+1<10){
							   mounth = "0"+(mydate.getMonth()+1);
						   }else{
							   mounth = mydate.getMonth()+1;
						   }
						   if(mydate.getDate()<10){
							   day = "0"+mydate.getDate();
						   }else{
							   day = mydate.getDate();
						   }
						   var str = "" + mydate.getFullYear() + "-";
						   str += mounth + "-";
						   str += day;
						   return str;
					 }
						     $('[data-date-include="first"],[data-date-include="last"]').datetimepicker({
				                 minView: "month", 
				                 language:  'zh-CN',
				                 format: 'yyyy-mm-dd',
				                 todayBtn:  1,
				                 autoclose: 1,
							 });
							 var modalDialog = {
							     dateModal:function(ele){
								     var dom = ele.parent("div.form-group").siblings(".form-inline");
								     var nowTime = show();
									 if(dom.find("input").eq(0)&&dom.find("input").eq(1)){
									     if(dom.find("input").eq(0).val()==""||dom.find("input").eq(0).val()==null||dom.find("input").eq(1).val()==""||dom.find("input").eq(1).val()==null){
									    	 alert("日期输入有误不能为空");
									    	 return false;
									     }else if(dom.find("input").eq(0).val()>dom.find("input").eq(1).val()){
											 alert("日期输入有误，请让起始时间小于截止时间");
											 return false;
										 }else if(dom.find("input").eq(0).val()<nowTime){
											 alert("起始时间不能小于今天");
											 return false;
										 }else{
											 $("#adDescribeTimeBegin").text(dom.find("input").eq(0).val());
										     $("#adDescribeTimeEnd").text(dom.find("input").eq(1).val());
										 }
									 }
									 ele.next().trigger("click"); 
								 },
								 setTotal:function(ele){
								     var dom = ele.parent("div.form-group").siblings(".form-inline");
									 if(dom.find("input").val()){
									     $("#setTotal").text(dom.find("input").val());
									 }	
									 ele.next().trigger("click");
								 },
								 setTotalValue:function(ele){
								     var showDom = $("#setTotal");
									 if(showDom.text()){
									     $(".setTotalModal").find("#setTotalModalValue").val(showDom.text());
									 }
								 },
								 setPrice:function(ele){
								     var dom = ele.parent("div.form-group").siblings(".form-inline");
									 if(dom.find("input").val()){
									     $("#setPrice").text(dom.find("input").val());
									 }							 
									 ele.next().trigger("click");
								 },
								 setPriceValue:function(ele){
								     var showDom = $("#setPrice");
									 if(showDom.text()){
									     $(".setPriceModal").find("#setPriceModalValue").val(showDom.text());
									 }
								 },
								 selectAdDitch:function(ele){
				                     var dom = ele.parent("div.form-group").siblings("select.selectAdModalOption");
					                 if(dom.val()){	
                                         var valDom = dom.children("option").eq(dom.val()),name=valDom.attr("data-adName"),appId=valDom.attr("data-id"),
						                 price = valDom.attr("data-price"),total = valDom.attr("data-total"),img = valDom.attr("data-img");						 					            
										 var itemHtml = '<li><img class="left" src="http://114.116.41.171:8089/videos/'+img+'" alt="">'+
										 '<input name="nameId" hidden class="left" alt=""/>'+
										 '<input name="img" hidden class="left" value="'+img+'" alt=""/>'+
						                 '<button class="btn btn-primary left">'+name+'</button><div class="right">'+
						                 '<input name="plName" hidden value="'+name+'"">'+'</input>'+
						                 '<input name="id" hidden value="'+appId+'"">'+'</input><div class="right">'+
					                     '<p><span>投放金额：</span><input name="plTotlePrice">'+'</input>(元)</p>'+
					                     '<p hidden><span>投放余额：</span><input name="advertiserBalance" hidden>'+'</input>(元)</p>'+
					                     '<p><span>投放单价：</span><input name="plPrice">'+'</input>(次/元)</p>'+
					                     '</div><div class="clear"></div></li>'
						                 modalDialog.selectAdDom.parent(".adDitchAll").next("ul.listGroup").append(itemHtml);
						                 ele.next().trigger("click");
					                 }else{
					                     alert("您尚未选择渠道，请选取后再操作！")
					                 }				 					 				     
				                 },
				                 selectAdDitchDom:"",
				                 selectAdDitchShow:function(ele){
				                     modalDialog.selectAdDom = ele;
				                 },
				                 /**selectAdDitchDel:function(ele){
				                     ele.parent("p").remove();
				                 }**/
							 }
							 
							 
							 
							 
			
						 </script>
				</div>
			</div>
		</div>
	</div>
	<!-- 投放金额 -->
	<div class="modal fade setTotalModal" tabindex="-1" role="dialog"
		aria-labelledby="myLargeModalLabel" aria-hidden="true">
		<div class="modal-dialog modal-sm">
			<div class="modal-content">
				<div class="modal-header" style="text-align:center">当前投放余额</div>
				<div class="modal-body" style="text-align:center;margin-top:40px">
					<div class="form-group form-inline" style="margin-bottom:40px">
						<input type="text" id="setTotalModalValue" class="form-control" />
					</div>
					<div class="form-group form-inline">
						<button class="btn btn-primary"
							onclick="modalDialog.setTotal($(this))">确定</button>
						<button class="btn btn-primary" style="margin-left:82px;"
							data-dismiss="modal">取消</button>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- 投放单价 -->
	<div class="modal fade setPriceModal" tabindex="-1" role="dialog"
		aria-labelledby="myLargeModalLabel" aria-hidden="true">
		<div class="modal-dialog modal-sm">
			<div class="modal-content">
				<div class="modal-body" style="text-align:center;margin-top:40px">
					<div class="form-group form-inline" style="margin-bottom:40px">
						<label>投放单价</label> <input type="text" id="setPriceModalValue"
							class="form-control" style="width:150px;" /> <label>元/次</label>
					</div>
					<div class="form-group form-inline">
						<button class="btn btn-primary"
							onclick="modalDialog.setPrice($(this))">确定</button>
						<button class="btn btn-primary" style="margin-left:82px;"
							data-dismiss="modal">取消</button>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- 选择渠道 -->
	<div class="modal fade selectAdDitchModal" tabindex="-1" role="dialog"
		aria-labelledby="myLargeModalLabel" aria-hidden="true">
		<div class="modal-dialog modal-lg">
			<div class="modal-content">
				<div class="modal-header"
					style="font-size:20px;font-weight:700;text-align:center">
					<label>选择投放渠道</label>
				</div>
				<div class="modal-body" style="text-align:center">
					<select id="advApp" class="selectAdModalOption" size="5">

					</select>
					<div class="form-group form-inline">
						<button class="btn btn-primary" style="margin-left:74px;"
							onclick="modalDialog.selectAdDitch($(this))">确定</button>
						<button class="btn btn-primary" style="margin-left:82px;"
							data-dismiss="modal">取消</button>
					</div>
				</div>
			</div>
		</div>
	</div>
</body>
<script type="text/javascript"
	src="/web-adv/advWeb/controller/adManagement/vedioAd/editVedioAd.js"></script>
</html>